<!DOCTYPE html>
<html  xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/layui/jquery-3.5.1.min.js"></script>
    <link rel="stylesheet" href="/layui/css/layui.css"  media="all">
    <script src="/layui/layui.js" charset="utf-8"></script>
</head>
<body>
    <div style="margin: auto; width: 1100px">

        <form class="layui-form layui-form-pane" action="">
            <fieldset class="layui-elem-field" style="margin: 20px;">
            <legend>员工资料</legend>
            <div class="layui-form-item" style=" width: 800px;float: left;margin-top: 50px;">
                <div class="layui-inline">
                    <label  class="layui-form-label">姓名：</label>
                    <div class="layui-input-inline">
                        <input th:value="${staff.name}" type="tel"   autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
                <div class="layui-inline">
                    <label  class="layui-form-label">工号：</label>
                    <div class="layui-input-inline">
                        <input th:value="${staff.jobNumber}" type="text"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>

            </div>

            <!--放图片-->
            <div style="float: left;width: 200px;height: 250px;margin-left: 20px;">
                <img th:src="@{'/image/headers/'+${staff.photo}}" style="width: 200px;height: 280px;margin-left: -75px;margin-top: 80px;">
            </div>

            <div class="layui-form-item" style=" width: 800px;float: left;margin-top: -140px;">
                <div class="layui-inline">
                    <label class="layui-form-label">部门：</label>
                    <div class="layui-input-inline">
                        <input th:value="${staff.departmentName}" type="tel" style="width: 515px;"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>

            </div>

            <div class="layui-form-item" style=" width: 800px;float: left;margin-top: -80px;">
                <div class="layui-inline">
                    <label class="layui-form-label">职位：</label>
                    <div class="layui-input-inline">
                        <input th:value="${staff.postName}" type="text" style="width: 515px;"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
            </div>

            <div class="layui-form-item" style="width: 800px;float: left;margin-top: -20px;">
                <div class="layui-inline">
                    <label class="layui-form-label">性别：</label>
                    <div class="layui-input-inline">
                        <input th:value="${staff.sex}" type="tel"   autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>

                <div class="layui-inline">
                    <label class="layui-form-label">出生日期：</label>
                    <div class="layui-input-inline">
                        <input type="text" th:value="${#dates.format(staff.dteBirth,'yyyy-MM-dd ')}" autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
            </div>

            <div class="layui-form-item" style=" width: 800px;float: left;margin-top: 0px;">
                <div class="layui-inline" th:if="${staff.politicalOutlook eq 0}">
                    <label class="layui-form-label">政治面貌：</label>
                    <div class="layui-input-inline">
                        <input type="tel" value="群众"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
                <div class="layui-inline" th:if="${staff.politicalOutlook eq 1}">
                    <label class="layui-form-label">政治面貌：</label>
                    <div class="layui-input-inline">
                        <input type="tel" value="团员"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
                <div class="layui-inline" th:if="${staff.politicalOutlook eq 2}">
                    <label class="layui-form-label">政治面貌：</label>
                    <div class="layui-input-inline">
                        <input type="tel" value="党员"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">民族：</label>
                    <div class="layui-input-inline">
                        <input type="text" th:value="${staff.nation}" autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
            </div>

            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">学历：</label>
                    <div class="layui-input-inline">
                        <input type="tel" th:value="${staff.education}" autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
                <div class="layui-inline" th:if="${staff.maritalStatus eq false}">
                    <label class="layui-form-label">婚姻状况：</label>
                    <div class="layui-input-inline">
                        <input type="text" value="未婚"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
                <div class="layui-inline" th:unless="${staff.maritalStatus eq false}">
                    <label class="layui-form-label">婚姻状况：</label>
                    <div class="layui-input-inline">
                        <input type="text" value="已婚"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
            </div>

            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label">电话：</label>
                    <div class="layui-input-inline">
                        <input type="text" th:value="${staff.phone}"   autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">邮箱：</label>
                    <div class="layui-input-inline">
                        <input type="text" th:value="${staff.email}"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">住址：</label>
                    <div class="layui-input-inline">
                        <input type="tel" th:value="${staff.address}"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
            </div>

            <div class="layui-form-item">
                <div th:if="${staff.card ne ''  and staff.card ne null}" class="layui-inline" >
                    <label class="layui-form-label">身份证：</label>
                    <div class="layui-input-inline" >
                        <input type="text" th:value="${#strings.substring(staff.card,0,14)+'****'}"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
                <div th:if="${staff.bankCard ne '' and staff.bankCard ne null}" class="layui-inline" >
                    <label class="layui-form-label">银行卡：</label>
                    <div class="layui-input-inline">
                        <input  type="text"  th:value="${#strings.substring(staff.bankCard,0,6)+'********'+#strings.substring(staff.bankCard,14,#strings.length(staff.bankCard))}" autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">入职时间：</label>
                    <div class="layui-input-inline">
                        <input type="tel" th:value="${#dates.format(staff.createTime,'yyyy-MM-dd ')}"   autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
            </div>

            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label" style="width: 120px;margin-left: -10px;">紧急联系人：</label>
                    <div class="layui-input-inline">
                        <input type="tel" th:value="${staff.emergencyContact1}"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">电话：</label>
                    <div class="layui-input-inline">
                        <input type="text" th:value="${staff.emergencyContact1Phone}"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
            </div>

            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label"style="width: 120px;margin-left: -10px;">紧急联系人：</label>
                    <div class="layui-input-inline">
                        <input type="tel" th:value="${staff.emergencyContact2}"   autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">电话：</label>
                    <div class="layui-input-inline">
                        <input type="text" th:value="${staff.emergencyContact2Phone}"  autocomplete="off" class="layui-input"disabled>
                    </div>
                </div>
            </div>
            </fieldset>
        </form>

    </div>
</body>
</html>